* {
    margin: 0;
    padding: 0;
    text-decoration: none;
    list-style: none;
}

#header {
    height: 1.3333rem;
    background-color: #1d6dff;
    padding: .1333rem;

    .logo {
        padding: .1867rem 0;
        margin-left: .1333rem;
        float: left;

        a {
            display: block;
        }
    }

    #app {
        float: right;

        img {
            width: 1.0667rem;
            height: 1.0667rem;
            opacity: .8;
            margin-top: .1333rem;
        }
    }
}

#search {
    height: 1.3333rem;
    border-bottom: .0267rem solid #ccc;
    position: relative;

    div {
        width: 9.4667rem;
        padding: .2667rem;

        input {
            height: .8rem;
            width: 90%;
            padding-left: 5%;
            border-radius: .4rem;
            background-color: #f1f1f1;
            border: none;
            font-size: .4267rem;
        }

        button {
            width: 1.68rem;
            height: .8rem;
            background: #1d6dff;
            border-radius: .4rem;
            position: absolute;
            right: .2667rem;
            top: .2667rem;
            border: none;
            line-height: .8rem;
            font-size: .4267rem;

        }
    }
}

// 导航
    nav{
        background-image: linear-gradient(to bottom, #fff, #ccc);
        display: flex;
        a{
            font-family: "微软雅黑", sans-serif;
         font-size: .3467rem;
            color: #666;
            text-decoration: none;
            display: inline-block;
            height: .5333rem;
            line-height: .5333rem;
            text-align: center;
            padding-left: .1333rem;
            padding-bottom: .1333rem;
           
        }
        a:nth-child(3){
            width: 2.6667rem;
            overflow: hidden;
            padding-bottom: 0;
            padding-left: 0;
        }
    }




//开始渲染

#matter {
    text-decoration: none;
    color: black;
    padding: .2667rem;

    .up {
        text-align: center;
        padding: .2667rem 0;

        .Img {
            align-items: center;

        }

        .Name {
            font-size: .48rem;
            margin: .2667rem 0;
        }

        .tag {
            margin-top: .1333rem;

            div {


                .tag-top {
                    float: left;
                    min-height: .0267rem;
                    padding-right: .4rem;
                    padding-left: .4rem;
                }

                .tag-btn {
                    float: right;
                }
            }
        }
    }

    .down {
        padding-bottom: .2667rem;

    }

}

.comment {
    border-top: .0267rem solid #ccc;
    border-bottom: .0267rem solid #ccc;
    padding-top: .2667rem;

    h4 {
        font-size: .48rem;
        width: 100%;
        height: .9333rem;
        line-height: .9333rem;
        text-align: center;
        background-color: #ccc;
    }

    .review {
        border-bottom: .0267rem solid #cccccc;
        margin: .1333rem 0;

        .each {
            border-bottom: .0267rem solid #cccccc;
            box-sizing: border-box;
            padding-bottom: .6667rem;
            .person {
                padding: .2667rem;
                padding-bottom: .4rem;

                span:nth-child(1) {
                    float: left;
                }

                span:nth-child(2) {
                    float: right;
                }
            }

            .message {
                display: inline-block;
                line-height: 1.42857143;
                color: #333;
                font-family: "微软雅黑", sans-serif;
                font-size: .3467rem;
                padding: .2667rem;
            }
            .source{
                float: right;
                padding-right: .2667rem;
                padding-bottom: .2667rem;
            
            }
        }
    }
}





#footer {
    background: #f4f4f4;

    .more {
        padding: .2667rem;

        a {
            display: block;
            font-size: .3467rem;
            line-height: .8rem;
            text-align: center;
            border-radius: .1333rem;
            border: .0267rem solid #dddddd;
            background-image: linear-gradient(#ffffff, #f4f4f4);
        }
    }

    #chart {
        background-color: #1d6dff;
        height: .9333rem;
        line-height: .9333rem;
        padding-left: .2667rem;
        margin: .2667rem 0;

        span {
            text-align: left;
            font-size: .5333rem;
            color: #fff;
            font-weight: bolder;
        }

        a {
            img {
                width: .5333rem;
                float: right;
                margin-top: .1867rem;
                margin-right: .2667rem;
            }
        }
    }

    #login {
        #row {
            height: .96rem;
            margin-top: .2667rem;
            border-top: .0267rem solid #c4c4c4;
            border-bottom: .0267rem solid #c4c4c4;

            a {
                display: block;
                color: #666;
                text-decoration: none;

                div {
                    height: .88rem;
                    line-height: .88rem;
                    text-align: center;
                    font-size: .3733rem;
                    border-right: .0267rem solid #c4c4c4;
                    float: left;
                    width: 25%;
                    position: relative;
                    min-height: .0267rem;
                    padding-right: .4rem;
                    padding-left: .4rem;
                }
            }
        }
    }

    #conter {
        padding: .2667rem;

        p {
            margin: 0 0 .2667rem;
            text-align: center;

            a {
                color: #666;
                text-decoration: none;
            }
        }
    }

}